<template>
  <div class="home">
    <div class="autd animated slideInRight">

      <el-table :data="datatitle" border style="width: 100%" v-loading="loading2" element-loading-text="拼命加载中">
        <el-table-column type="expand">
          <template slot-scope="props">
            <el-table :data="props.row.info" style="width: 100%;float:left;" v-loading="loading2"
                      element-loading-text="拼命加载中">
              <el-table-column prop="goods_name" label="商品名称" width="200">
              </el-table-column>
              <el-table-column prop="class_name" label="商品图片 " width="280">
                <template slot-scope="scope">
                  <img :src="urlimg+scope.row.thumbnail" class="img_"/>
                </template>
              </el-table-column>
              <el-table-column prop="pivot.goods_num" label="商品数量" width="200">
              </el-table-column>
              <el-table-column prop="price" label="商品单价" width="200">
              </el-table-column>
              <el-table-column prop="" label="小计" width="200">
                <template slot-scope="scope">
                  <span>{{scope.row.price * scope.row.pivot.goods_num}}</span>
                </template>
              </el-table-column>
            </el-table>
          </template>
        </el-table-column>
        <el-table-column prop="wx_order_num" label="订单编号" width="150">
        </el-table-column>
        <el-table-column prop="user.nickname" label="用户昵称" width="130">
        </el-table-column>
        <el-table-column prop="user.phone" label="用户电话" width="130">
        </el-table-column>
        <el-table-column prop="actual_price" label="订单总金额" width="130">
        </el-table-column>
        <el-table-column prop="total" label="折扣金额" width="130">
        </el-table-column>
        <el-table-column prop="userinfo.default_address" label="用户地址" width="280">
        </el-table-column>
        <el-table-column prop="express_number" label="发货信息（例：快递号）" width="250">
        </el-table-column>
        <el-table-column prop="created_at" label="添加时间" width="180">
        </el-table-column>
      </el-table>


      <el-pagination
        @current-change="handleCurrentChange"
        :current-page="cur"
        :page-size="pagesize"
        :page-count="currentPage4"
        layout="total, prev, pager, next" :total="total">
      </el-pagination>
    </div>

    <el-dialog title="订单处理" :visible.sync="dialogFormVisible">
      <el-form>
        <el-form-item label="订单备注信息:" :label-width="formLabelWidth">
     <textarea class="text_ares" v-model="express" placeholder="可填写快递公司和快递编号等信息">
     </textarea>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="ExpressHandling">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
  import  img from  "~/timg.jpg";
  export default {
    components: {},
    data(){
      return {
        img,
        urlimg: this.$IMG,
        salesman: '',//业务员
        pagesize: this.$store.state.attribute.page, //每页条数
        total: 1, //总条数
        currentPage4: 1, //总页数
        cur: 1, //当前页数
        loading2: true,
        Temporary: [],  //总数据
        datatitle: [],  //当页数据
        value4: '',
        Seeclass: [],
        fenleiflag: 1,
        imgarr: {},
        imgtext: "",
        rowindex: '',

        dialogFormVisible: false,
        formLabelWidth: '120px',
        express: '',//快递编号
        orderinfo: {},//订单信息
        orderIndex: 0,//订单位置
      }
    },
    methods: {

      handleCurrentChange(val) { //分页
        if (this.fenleiflag != 1) {
          this.loading2 = true;
          this.bodyaudh(val)
        }
      },
      bodyaudh(e) {
        this.http.post({
          'api': 'adminGetOrders',
          'data': {
            'data': {
              "status": 2,
              "limit": this.pagesize,
              'express':'123',
            }
          },
          "page": e,
        }).then((res) => {
          this.shuju(res.data);
          this.fenleiflag = 0;
        }, (err) => {
          if (err) {
            this.$h.Ed(err, this);
          }
        })
      },
      shuju(data) {
        this.loading2 = false;
        this.total = data.total; //数据总的条数
        this.currentPage4 = data.last_page;
        this.datatitle = data.data;
      },
    },
    watch: {},
    computed: {
      //计算属性
    },
    mounted(){
      this.bodyaudh(1);
      //生命周期
    }
  }
</script>
<style scoped>
  .home {
    width: 100%;
    height: 100%;
  }

  .text_ares {
    width: 86%;
    height: 219px;
    margin-top: 11px;

  }
</style>
